<template>
	<view class="activity-box" :class="detail.promotion||detail.groupBuying||preferentialMapStatus||detail.combinationSales?'':'activity-box2'">
		<view class="left">
			<text class="activity-name" v-if="detail.promotion">{{detail.promotion.sDesName}}</text>
			<text class="activity-name" v-if="detail.groupBuying">{{detail.groupBuying.name}}</text>
			<text class="activity-name" v-if="preferentialMapStatus">{{otherInfo.name}}</text>
			<text class="activity-name"
				v-if="detail.preferentialMap&&detail.preferentialMap.pricepreferentialList.length>0">{{detail.preferentialMap.pricepreferentialList[0].pricePreferentialName}}</text>
			<text class="activity-name"
				v-if="detail.preferentialMap&&detail.preferentialMap.giftpreferentialList.length>0">{{detail.preferentialMap.giftpreferentialList[0].giftPreferentialName}}</text>
				<text class="activity-name"
					v-if="detail.combinationSales">{{detail.combinationSales[0].name}}</text>
			<text class="price">￥{{detail.fSalePrice}}</text>
			<text class="m-price">¥{{detail.fMarkPrice}}</text>
		</view>
		<view class="right" v-if="detail.promotion||detail.groupBuying">
			<text class="activity-desc" >距结束{{times}}</text>
			<view class="stock-box">
				<text class="total-num">
					<text class="now-num"
						:style="{width:detail.lInventoryCount/(detail.lInventoryCount+detail.iSales)*100+'%'}"></text>
				</text>
				<text class="justRemnant">仅剩{{detail.lInventoryCount}}{{detail.unit_name}}</text>
			</view>
		</view>

	</view>
</template>
<script>
	export default {
		name: "",
		components: {

		},
		data() {
			return {
				detail: {
					preferentialMap: {
						pricepreferentialList: [],
						giftpreferentialList: []
					}

				},
				timer: null,
				times: "--天--:--:--",
				preferentialMapStatus: false,
				otherInfo: {}

			}
		},
		methods: {
			setDatas(val) {
				this.detail = val

				if (this.detail.preferentialMap && (this.detail.preferentialMap.giftpreferentialList.length > 0 || this
						.detail.preferentialMap
						.postPartProductList.length > 0 || this.detail
						.preferentialMap.pricepreferentialList.length > 0)) {
					this.preferentialMapStatus = true
				}
				// this.detail.preferentialMap.postlistMap.length > 0||
				if (this.detail.promotion) {
					this.timeDown()
				}
				if (this.detail.groupBuying) {
					this.timeDowns()
				}

			},
			setStatus(val, item) {
				this.preferentialMapStatus = val
				this.otherInfo = item

			},
			timeDown() { // 倒计时

				clearInterval(this.timer);
				var starttime = new Date(this.detail.promotion.pStartDate.replace(/-/g, "/")) / 1000;
				var nowDate = Math.round(new Date() / 1000); // 当前时间
				//var endtime = Number(this.initActiveMsgObj.end_time); 
				var endtime = new Date(this.detail.promotion.pEndDate.replace(/-/g, "/")) / 1000;
				// endtime = Math.round(new Date('2019/7/10 14:56:00') / 1000); + 60;
				if (endtime < nowDate) {
					return
				}


				var totalSeconds = parseInt((endtime - nowDate)); // 相差的总秒数
				//天数
				var days = Math.floor(totalSeconds / (60 * 60 * 24));
				//取模（余数）
				var modulo = totalSeconds % (60 * 60 * 24);
				//小时数
				var hours = Math.floor(modulo / (60 * 60));
				hours = hours < 10 ? ('0' + hours) : hours;
				modulo = modulo % (60 * 60);
				//分钟
				var minutes = Math.floor(modulo / 60);
				minutes = minutes < 10 ? '0' + minutes : minutes;
				// console.log(minutes)
				//秒
				var seconds = modulo % 60;
				seconds = seconds < 10 ? '0' + seconds : seconds;
				// console.log(seconds);
				//输出到页面
				this.times = days + '天' + hours + ':' + minutes + ':' + seconds;
				// console.log(days + "天" + hours + "时" + minutes + "分");
				//if(totalSeconds <= 0){
				if (totalSeconds <= 60) {
					clearInterval(this.timer);
					// window.location.reload()
				} else {
					this.timer = setInterval(this.timeDown, 1000);
				}
			},
			timeDowns() { // 倒计时

				clearInterval(this.timer);
				var starttime = new Date(this.detail.groupBuying.startTime.replace(/-/g, "/")) / 1000;
				var nowDate = Math.round(new Date() / 1000); // 当前时间
				//var endtime = Number(this.initActiveMsgObj.end_time); 
				var endtime = new Date(this.detail.groupBuying.endTime.replace(/-/g, "/")) / 1000;
				// endtime = Math.round(new Date('2019/7/10 14:56:00') / 1000); + 60;
				if (endtime < nowDate) {
					return
				}


				var totalSeconds = parseInt((endtime - nowDate)); // 相差的总秒数
				//天数
				var days = Math.floor(totalSeconds / (60 * 60 * 24));
				//取模（余数）
				var modulo = totalSeconds % (60 * 60 * 24);
				//小时数
				var hours = Math.floor(modulo / (60 * 60));
				hours = hours < 10 ? ('0' + hours) : hours;
				modulo = modulo % (60 * 60);
				//分钟
				var minutes = Math.floor(modulo / 60);
				minutes = minutes < 10 ? '0' + minutes : minutes;
				// console.log(minutes)
				//秒
				var seconds = modulo % 60;
				seconds = seconds < 10 ? '0' + seconds : seconds;
				// console.log(seconds);
				//输出到页面
				this.times = days + '天' + hours + ':' + minutes + ':' + seconds;
				// console.log(days + "天" + hours + "时" + minutes + "分");
				//if(totalSeconds <= 0){
				if (totalSeconds <= 60) {
					clearInterval(this.timer);
					// window.location.reload()
				} else {
					this.timer = setInterval(this.timeDowns, 1000);
				}
			},
		}


	}
</script>

<style scoped lang="less">
	.activity-box {

		height: 161upx;
		background: rgba(240, 64, 111, 1);
		padding: 31upx 20upx;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.left {
			.activity-name {
				display: block;
				font-size: 27upx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				color: rgba(255, 255, 255, 1);
				// color:#333;
				text-align: left;
			}

			.price {
				font-size: 51upx;
				font-family: Microsoft YaHei;
				f00 font-weight: bold;
				color: rgba(255, 255, 255, 1);
				// color:#ed3d5f;
				text-align: left;

				text {
					font-size: 22rpx;
				}
			}

			.m-price {
				margin: 0 12upx;
				color: #fff;
				// color: #ed3d5f;
				text-decoration: line-through;
				font-size: 27upx;
			}
		}

		.right {
			flex: 1;
			text-align: right;

			.activity-desc {
				display: block;
				font-size: 25upx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				// color:#333;
				color: #fff;

				.dso {
					width: 28rpx;
					height: 28rpx;
					background: rgba(255, 255, 255, 1);
					border-radius: 14rpx;
					text-align: center;
					font-size: 18rpx;
					font-family: Microsoft YaHei;
					font-weight: 400;
					color: rgba(240, 64, 111, 1);
					line-height: 28rpx;
					display: inline-block;
					margin-left: 8rpx;
				}
			}

			.stock-box {
				display: inline-flex;
				align-items: center;
				justify-content: flex-end;

				.total-num {
					width: 100upx;
					height: 5upx;
					background: rgba(209, 55, 96, 1);
					border-radius: 3upx;
					position: relative;
					margin-right: 8upx;

					.now-num {
						position: absolute;
						width: 0;
						height: 100%;
						left: 0;
						top: 0;
						background: #fff;
					}
				}

				.justRemnant {
					font-size: 25upx;
					font-family: Microsoft YaHei;
					font-weight: 400;
					color: rgba(255, 255, 255, 1);
					// color:#ed3d5f;
				}
			}
		}



	}

	.activity-box2 {

		height: auto;
		// background:rgba(240,64,111,1);
		background: #fff;
		padding: 0upx 20upx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: -20upx;
		.left {
			.activity-name {
				display: block;
				font-size: 27upx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				// color:rgba(255,255,255,1);
				color: #333;
				text-align: left;
			}

			.price {
				font-size: 51upx;
				font-family: Microsoft YaHei;
				f00 font-weight: bold;
				// color:rgba(255,255,255,1);
				color: #ed3d5f;
				text-align: left;

				text {
					font-size: 22rpx;
				}
			}

			.m-price {
				margin: 0 12upx;
				// color: #fff;
				color: #ed3d5f;
				text-decoration: line-through;
				font-size: 27upx;
			}
		}

		.right {
			flex: 1;
			text-align: right;

			.activity-desc {
				display: block;
				font-size: 25upx;
				font-family: Microsoft YaHei;
				font-weight: 400;
				color: #333;

				// color: #fff;
				.dso {
					width: 28rpx;
					height: 28rpx;
					background: rgba(255, 255, 255, 1);
					border-radius: 14rpx;
					text-align: center;
					font-size: 18rpx;
					font-family: Microsoft YaHei;
					font-weight: 400;
					color: rgba(240, 64, 111, 1);
					line-height: 28rpx;
					display: inline-block;
					margin-left: 8rpx;
				}
			}

			.stock-box {
				display: inline-flex;
				align-items: center;
				justify-content: flex-end;

				.total-num {
					width: 100upx;
					height: 5upx;
					background: #eee;
					border-radius: 3upx;
					position: relative;
					margin-right: 8upx;

					.now-num {
						position: absolute;
						width: 0;
						height: 100%;
						left: 0;
						top: 0;
						background: rgba(209, 55, 96, 1);
					}
				}

				.justRemnant {
					font-size: 25upx;
					font-family: Microsoft YaHei;
					font-weight: 400;
					// color:rgba(255,255,255,1);
					color: #ed3d5f;
				}
			}
		}



	}
</style>
